<template>
  <div class="dashboard-container">
    <!--<panel-group></panel-group>-->
    <!--<el-row :gutter="35">-->
      <!--<el-col :xs="24" :sm="24" :lg="24">-->
        <!--<div class="chart-wrapper">-->
          <!--<line-chart/>-->
        <!--</div>-->
      <!--</el-col>-->
    <!--</el-row>-->
    <!--<el-row :gutter="35">-->
      <!--<el-col :xs="12" :sm="12" :lg="12">-->
        <!--<div class="chart-wrapper">-->
          <!--<pie-chart/>-->
        <!--</div>-->
      <!--</el-col>-->
      <!--<el-col :xs="12" :sm="12" :lg="12">-->
        <!--<div class="chart-wrapper">-->
          <!--<bar-chart/>-->
        <!--</div>-->
      <!--</el-col>-->
    <!--</el-row>-->
    <!--<iframe src="https://www.tlkjjt.com/qpc.html" width="620px" height="430px"/>-->
    <div id="video-container"></div>
  </div>
</template>

<script>
import PanelGroup from '@/views/dashboard/components/PanelGroup'
import LineChart from '@/views/dashboard/components/LineChart'
import PieChart from '@/views/dashboard/components/PieChart'
import BarChart from '@/views/dashboard/components/BarChart'
import EZUIKit from "ezuikit-js";

    export default {
        name: "dashboard",
        components: {
            // PanelGroup,
            // LineChart,
            // PieChart,
            // BarChart
        },
        props: {},
        data() {
            return {
                ezvizPlay: null
            }
        },
        created() {},
        methods: {},
        mounted() {
            if (this.ezvizPlay !== null) {
                return
            }
            //获取萤石token
            this.ezvizPlay = new EZUIKit.EZUIKitPlayer({
                autoplay: true,  // 默认播放
                //视频播放包裹元素
                id: "video-container",
                //萤石token
                accessToken: "at.d5ndsnb00am6dpr056p193q2d4ha25un-4n77a11fhc-0y3bc60-qjspmqhk4",
                url: "ezopen://open.ys7.com/E91740818/1.live", // 播放地址
                height:500,
                width:500
              });

        },
        watch: {},
        computed: {},
        destroyed() {}
    }
</script>

<style lang="less" scoped>
.dashboard-container {
  padding: 32px 32px 0;
  background-color: rgb(240, 242, 245);
  position: relative;

  .chart-wrapper {
    background: #fff;
    padding: 16px 16px 0;
    margin-bottom: 32px;
  }
}
</style>
